import React, { Component } from 'react'
import { Button, Table, Modal, Row, Col, Popconfirm, Input, Form, message } from 'antd';
import { connect } from 'react-redux';
import { findAuditExaming, passAudit, unpassAudit, getResourceInfo, getResourceTableInfo} from '../../../api/resourceCategory/resourceCategory'
import CommonView from '../commonView'
const { TextArea} = Input
class UnAudit extends Component {
  constructor() {
    super()
    this.state = {
      dataSource: [],
      resourceId: '',
      passDataSource: [],
      passBaseInfo: {},
      reason: '',
      showUnTrend: false,
      showAudit: false,
      paginationNo: {
        pageSize: 10,
        defaultCurrent:1,
        current:1,
      },
      columns : [
        {
          title: '操作',
          dataIndex: 'action',
          key: 'action',
          width: 220,
          render: (text, record) => {
            return (
              <div>
                <Button size="small" type="link" onClick={() => this.handleAudit(record)}>审核</Button>
              </div>
            )
          }
        }
      ]
    }


  }

  getUnAudit = (number, page, pageSize) => {
    findAuditExaming({pageNum: page, pageSize: pageSize, number}).then(res => {
      if(res.data.metaData.code === 'success') {
        const paginationNo = this.state.paginationNo
        paginationNo.total = res.data.data.total
        paginationNo.current = res.data.data.pageNum
        this.setState({dataSource: res.data.data.list})
      }
    })
  }
  componentWillMount() {

    console.log('this.props.baseCOlumns', this.props.baseColumns)
    this.setState({
      columns: [...this.props.baseColumns ,...this.state.columns]
    })
    this.getUnAudit('01010101', 1,10)
  }
  handleOk = e => {
    this.setState({
      showAudit: false
    })
  }

  handleAudit = record => {
    console.log('audit', record)
    let requestData = {resourceId: record.resource_id,}
    getResourceInfo(requestData).then(res => {
      if(res.data.metaData.code === 'success') {
        this.setState({passBaseInfo: res.data.data})
      }
    })
    getResourceTableInfo(requestData).then(res => {
      if(res.data.metaData.code === 'success') {
        this.setState({passDataSource: res.data.data, showAudit: true, resourceId: record.resource_id})
      }
    })
  }
  handlePost = e => {
    passAudit({resourceId: this.state.resourceId}).then(res => {
      if(res.data.metaData.code === 'success') {
        message.success(res.data.metaData.message)
      }
    })
  }

  handleUnTrend = () => {
    this.setState({
      showAudit: false,
      showUnTrend: true
    })
  }

  confirmUnTrend = () => {//确认退回
    console.log('confirm ')
    let obj = {explanation: this.state.reason, resourceId: this.state.resourceId}
    unpassAudit(obj).then( res => {

    })
  }

  handleTextAreaChange = e => {
    console.log('textArea change', e.target.value)
    this.setState({
      reason: e.target.value
    })
  }
  render() {
    const  { curRecord, columns, dataSource, showAudit, showUnTrend } = this.state
    const  { resourceId, passBaseInfo, passDataSource } = this.state
    return (
      <div>
        <Table
          size="small" loading={this.state.loading}
          dataSource={dataSource}
          columns={columns} bordered rowKey={record => record.taskId} 
          style={{ padding: 20 }}
          pagination={this.state.paginationNo} />
          
        <Modal title='审核'
         visible={showAudit} width={700}
         bodyStyle={{backgroundColor:'#f0f3f6',overflow:'auto',height:640}}
         onOk={this.handleOk} onCancel={this.handleOk} closable={true}
         footer={null}
         >
            <CommonView resourceId={ resourceId} dataSource={passDataSource} infos={passBaseInfo} />
            <div style={{padding: '0px 20px 0px 20px',  backgroundColor: '#fff',   margin: '24px 16px 0 16px '}}>
              <div style={{ width:'300px', margin:'auto'}}>
              <Button type="primary"  size='small' ghost onClick={this.handleUnTrend}>退回</Button>
              <Button type="primary" style={{marginLeft: '30px'}} onClick={this.handlePost} size='small' >报送</Button>
              </div>
            </div>
        </Modal>

        <Modal title='填写退回说明' closable visible={showUnTrend} footer={null}  width={500} >
          <TextArea rows={4} style={{width: '400px'}} placeholder="请填写退回说明" onBlur={e => this.handleTextAreaChange(e)} />
          <div style={{padding: '0px 20px 0px 20px',  backgroundColor: '#fff',   margin: '24px 16px 0 16px '}}>
            <div style={{ width:'300px', margin:'auto'}}>
              <Button type="primary"  size='small' ghost onClick={e => this.setState({showUnTrend: false})}>取消</Button>
              <Button type="primary" style={{marginLeft: '30px'}} onClick={this.confirmUnTrend} size='small' >确认退回</Button>
            </div>
          </div>
        </Modal>
        
      </div>
    )
  }
}

export default UnAudit


